<template>
  <div>
    <h3>显示一个全局的引用使用方法--在main.js中</h3>
    <pre>
      <span class='im'>import</span> Vue from <span class='pag'>'vue'</span>
      <span class='im'>import</span> App from <span class='pag'>'./App.vue'</span>
      <span class='im'>import</span> router from <span class='pag'>'./router'</span>
      // 引入wwd-ui
      <span class='im'>import</span> WdUi from <span class='pag'>'wwd-ui'</span>
      // 引入wwd-ui的css样式
      <span class='im'>import</span> <span class='pag'>'wwd-ui/dist/wd-ui.css'</span>
      Vue.config.productionTip = <span class="pag">false</span>
      <span class="im">Vue.use(WdUi)</span>
      <span class="pag">new</span> Vue({
        router,
        render: h => h(App)
      }).$mount('#app')
    </pre>
  </div>
</template>

<script>

export default {
  name: 'usuage'
}
</script>
<style scoped>
  div {
    font-size: 36px;
    margin: 20px;
  }
  pre {
    background-color: #000;
    color: #fff;
    margin: 20px;
    border-radius: 10px;
    -webkit-user-select: text;
    padding: 20px;
    font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;;
  }
</style>
